<template name="page-head">
	<view :style="'height:'+topHeight+'px'" class="topBox" style="background-color: #fff;">
		<!-- 子页面头部 -->
		<view id="indexTop" v-if="headtype === 2" class='indexTop clearfix flex-start' :style="'top:'+top+'px;height:40px'">
			<uni-icons class="fl fl_return" type="left" size="26" color="#000" @click="getback"></uni-icons>
			<view class="flex-center textbox">
				<!-- <image class="toplogo" src="../../static/image/top_img.png"></image> -->
				<view class="topname">{{title}}</view>
			</view>
		</view>
		<!-- 主页面头部 -->
		<view id="indexTop" v-if="headtype === 1" class='indexTop clearfix flex-start' :style="'top:'+top+'px;height:40px'">
			<view class="nbsp"></view>
			<view class="flex-center textbox">
				<!-- <image class="toplogo" src="../../static/image/top_img.png"></image> -->
				<view class="topname">{{title}}</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		name: "page-head",
		props: {
			title: {
				type: String,
				default: ""
			},
			headtype: {
				type: Number,
				default: 1
			},
		},
		data() {
			return {
				top:0,
				topHeight:0,
			}
		},
		onLoad() {
			
		},
		methods: {
			getTopHeight(){
				var that=this
				uni.getSystemInfo({
				    success: function (res) {
				    	// #ifdef  MP-WEIXIN
						var menu = wx.getMenuButtonBoundingClientRect();
						that.top = menu.top
						that.topHeight= that.top+40
						// #endif
					}
				}); 
			},
			getback() {
				uni.navigateBack({
					delta: 1
				});
			}
		}
	}
</script>
<style>
	/* 头部 */
	.topBox{
		position: sticky;
		top: 0;
		z-index: 101;
	}
	.indexTop {
		width: 100%;
		position: fixed;
		top: 0;
		background: #fff;
	}

	.fl_return {
		margin-left: 18rpx;
	}

	.toplogo {
		width: 132rpx;
		height: 54rpx;
		/* margin-top: 6rpx; */
		margin-left: 26rpx;
		margin-right: -14rpx;
	}

	.textbox {
		width: 500rpx;
	}

	.topname {
		font-size: 30rpx;
	}
	.nbsp{
		width: 65rpx;
		height: 48rpx;
	}
	/* 头部 */
</style>
